<html>
<body>

<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
function ajaxFunction(){
	var ajaxRequest;  // The variable that makes Ajax possible!

	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			var ajaxDisplay = document.getElementById('ajaxDiv');
			ajaxDisplay.innerHTML = ajaxRequest.responseText;
		}
	}
	var age = document.getElementById('age').value;
	var wpm = document.getElementById('wpm').value;
	var sex = document.getElementById('sex').value;
	var queryString = "?age=" + age + "&wpm=" + wpm + "&sex=" + sex;
	ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
	ajaxRequest.send(null);
}





function addNames() {

  mailList = window.document.forms['myForm'].elements['F'];
  srcList = window.document.forms['mainform'].elements['M'];

  if (mailList.options[0].text == "No Items Selected") {
    mailList.options[0] = null;
  }
  var len = mailList.length;
  for(var i = 0; i < srcList.length; i++) {
    if ((srcList.options[i] != null) && (srcList.options[i].selected)) {
      //Check if this value already exist in the destList or not
      //if not then add it, otherwise do not add it.
      var found = false;
      for(var count = 0; count < len; count++) {
        if (mailList.options[count] != null) {
          if (srcList.options[i].text == mailList.options[count].text) {
            found = true;
            break;
          }
        }
      }
      //if (found != true) {
        mailList.options[len] = new Option(srcList.options[i].text);
        len++;
        //}
      }
   }

   }


//-->
</script>



<form name='myForm'>
Max Age: <input type='text' id='age' /> <br />
Max WPM: <input type='text' id='wpm' />
<br />
Sex: <select id='sex'>
<option value='m'>m</option>
<option value='f'>f</option>
</select>
<input type='button' onclick='ajaxFunction()' value='Query MySQL' />




</form>
<div id='ajaxDiv'>Your result will display here<br>
<select name="M" size="5" multiple="">
	<option>none</option>

</select>

</div>
</body>
</html>
